<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>角色管理/人员分配</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="${ctx}/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="${ctx}/systemStatic/style/admin.css">
    <link rel="stylesheet" href="${ctx}/iconfont/iconfont.css"/>
    <link rel="stylesheet" href="${ctx}/css/public.css">
    <script type="text/javascript">
        var __ctx = "${ctx}";
    </script>
</head>
<body>
    <table id="managementOfSubs" lay-filter="managementOfSubs"></table>
    <div class="bottom" style="text-align: center;margin-top: 10px">
        <button class="layui-btn cancelMan layui-btn-danger">关闭</button>
    </div>
    <script type="text/html" id="headermanagement">
        <div class="layui-btn-container">
            <a class="layui-btn layui-btn-sm" lay-event="add">
                <i class="layui-icon">&#xe654;</i>
                <span>新增</span>
            </a>
            <a class="layui-btn layui-btn-sm" lay-event="delete">
                <i class="layui-icon">&#xe640;</i>
                <span>删除</span>
            </a>
            <a class="layui-btn layui-btn-sm" lay-event="query">
                <i class="layui-icon">&#xe615;</i>
                <span>查询</span>
            </a>
            <a class="layui-btn layui-btn-sm" lay-event="clears">
                <i class="layui-icon">&#xe9aa;</i>
                <span>重置</span>
            </a>
        </div>
        <form class="layui-form headManagement" action="" lay-filter="headManagement" style="margin-top:10px">
            <div class="table-top-filter">
                <div class="table-filter-alone">
                    <label class="layui-form-label">姓名</label>
                    <input style="width:180px" type="text" class="layui-input filter-value" name="Q_fullName_SL"/>
                </div>
                <div class="table-filter-alone">
                    <label class="layui-form-label">账号</label>
                    <input style="width:180px" type="text" class="layui-input filter-value" name="Q_account_SL"/>
                </div>
                <div class="table-filter-alone">
                    <label class="layui-form-label">组织名称</label>
                    <input style="width:180px" type="text" class="layui-input filter-value" name="Q_orgName_SL"/>
                </div>
            </div>
        </form>
    </script>
    <script type="text/html" id="userHeaderbar">
        <div class="layui-btn-container">
            <a class="layui-btn layui-btn-sm" lay-event="query">
                <i class="layui-icon">&#xe615;</i>
                <span>查询</span>
            </a>
            <a class="layui-btn layui-btn-sm" lay-event="clears">
                <i class="layui-icon">&#xe9aa;</i>
                <span>重置</span>
            </a>
        </div>
        <form class="layui-form userHeadManagement" action="" lay-filter="userHeadManagement" style="margin-top:10px">
            <div class="table-top-filter">
                <div class="table-filter-alone">
                    <label class="layui-form-label">姓名</label>
                    <input style="width:95px" type="text" class="layui-input queryName filter-value" name="Q_fullName_SL"/>
                </div>
                <div class="table-filter-alone">
                    <label class="layui-form-label">所属组织</label>
                    <input style="width:95px" type="text" class="layui-input queryName filter-value" name="Q_orgName_SL"/>
                </div>
            </div>
        </form>
    </script>
    <div name="userSelectorOne" hidden style="display: none">
        <div class="ccpui-nocenterTree">
            <div class="filter-table" style="position: relative;">
                <div style="width: 66%">
                    <table id="orgSelectorsAdds" lay-filter="orgSelectorsAdds"></table>
                </div>
                <div id="userSelector" class="ccpui-userSelector" style="height:455px;">
                    <table class="layui-table" style="margin-top:0 ">
                        <thead>
                        <tr>
                            <th>已选择</th>
                        </tr>
                        </thead>
                        <tbody class="orgContentDivs">
                        <tr>
                            <td></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <div class="bottom" style="position: absolute;bottom:15px;left:272px;z-index: 666">
            <button class="layui-btn saveData">保存</button>
            <button class="layui-btn cancelUserData">撤销</button>
            <button class="layui-btn cancelDatas layui-btn-danger">关闭</button>
        </div>
    </div>
    <script type="text/html" id="rightToolsBarManage">
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>
    <script src="${ctx}/public/component.js" type="text/javascript"></script>
    <script src="${ctx}/layui/layui.js"></script>
    <script>
        layui.config({
            base: serverPath.systemPath + staticPath.systemPath //静态资源所在路径
        }).extend({
            index: 'index' //主入口模块
        }).use(['index', 'setter', 'commons', 'form', 'jquery', 'layer', 'table', 'totalFilter','common'], function () {
            var table = layui.table, layer = layui.layer, form = layui.form, $ = layui.jquery,
                totalFilter = layui.totalFilter, setter = layui.setter, common = layui.common, commons = layui.commons;
            var userList = [];
            var disOfStaff = [];
            var superConfigDatas = [];
            var indexUsreSel;// 弹窗关闭
            var roleId = '${roleId}';
            var orgId = '${orgId}';

            table.render({
                elem: '#managementOfSubs',
                cellMinWidth: 80,
                height: 'full-64',
                url: serverPath.systemPath + setter.sysLinkPath + 'userRole/list',
                page: true, //开启分页
                method: 'get',
                defaultToolbar: ['filter', 'print'],
                toolbar: '#headermanagement',
                where: {
                    roleId: roleId
                },
                cols: [
                    [ //表头
                        {type: 'checkbox', fixed: 'left'},
                        {field: ' userRoleId ', title: 'ID', sort: true, hide: true},
                        {field: 'fullName', align: 'center', title: '用户名称', sort: true},
                        {field: 'account', align: 'center', title: '账号', sort: true},
                        {fixed: 'right', width: 200, align: 'center', title: '管理', toolbar: '#rightToolsBarManage'}
                    ]
                ],
            });
            table.on('toolbar(managementOfSubs)', function (obj) {
                var checkStatus = table.checkStatus(obj.config.id);
                var data = checkStatus.data;
                switch (obj.event) {
                    case 'add':
                        indexUsreSel = layer.open({
                            type: 1,
                            area: ['850px', '500px'],
                            resize: false,
                            title: ['用户选择器'],
                            content: $("[name='userSelectorOne']"),
                            success: function () {
                                $.ajax({
                                    url: serverPath.systemPath + setter.sysLinkPath + 'userRole/list',
                                    type: "get",
                                    dataType: 'json',
                                    data: {
                                        needPage: "0",
                                        roleId: roleId
                                    },
                                    success: function (data) {
                                        if (commons._filterRecord(data)) {
                                            disOfStaff = [];
                                            for (var i = 0; i < data.data.length; i++) {
                                                disOfStaff.push({
                                                    name: data.data[i].fullName,
                                                    userId: data.data[i].userId
                                                });
                                            }
                                            userList = disOfStaff;
                                            table.reload("orgSelectorsAdds", {
                                                parseData: function (res) {
                                                    var _data = res.data;
                                                    if (_data.length > 0 && userList.length > 0) {
                                                        for (var i = 0; i < _data.length; i++) {
                                                            var _d = _data[i];
                                                            for (var j = 0; j < userList.length; j++) {
                                                                var _td = userList[j];
                                                                if (_d.userId === _td.userId) {
                                                                    _d.LAY_CHECKED = true;
                                                                }
                                                            }
                                                        }
                                                    }
                                                },
                                                page: {curr: 1}
                                            });
                                            $(".orgContentDivs").html("");
                                            for (var i = 0; i < userList.length; i++) {
                                                $(".orgContentDivs").append("<tr><td>" + "<span>" + userList[i].name + "</span>" + " <i selectIds=" + "'" +
                                                    userList[i].userId + "'" + "class='layui-icon' style='position:absolute;right:12px;cursor: pointer'>&#xe640;</i></td></tr>");
                                            }
                                        } else {
                                            window.parent.layer.alert(data.msg);
                                        }
                                    }
                                })
                            }
                        });
                        table.reload("orgSelectorsAdds");
                        break;
                    case 'delete':
                        if (data.length === 0) {
                            layer.msg('请先选择一行数据！');
                        } else {
                            var seleIds = [];
                            for (var i = 0; i < data.length; i++) {
                                seleIds.push(data[i].userRoleId);
                            }
                            layer.confirm('确定删除当前数据吗？', function (index) {
                                layer.close(index);
                                $.ajax({
                                    url: serverPath.systemPath + setter.sysLinkPath + "userRole/del",
                                    type: "post",
                                    dataType: 'json',
                                    data: {
                                        userRoleId: seleIds.join(","),
                                    },
                                    success: function (data) {
                                        if (commons._filterRecord(data)) {
                                            window.parent.layer.alert(data.msg);
                                            table.reload('managementOfSubs', {page: {curr: 1,},});
                                        } else {
                                            window.parent.layer.alert(data.msg);
                                        }
                                    }
                                })
                            })
                        }
                        break;
                    case 'query':
                        common.tableConditionRender("managementOfSubs", "headManagement", {where: {}}, false);
                        break;
                    case 'clears':
                        common.tableConditionRender("managementOfSubs", "headManagement", {where: {}}, true);
                }
            });
            table.on('tool(managementOfSubs)', function (obj) {
                var data = obj.data, //获得当前行数据
                    layEvent = obj.event; //获得 lay-event 对应的值del
                switch (layEvent) {
                    case 'del':
                        layer.confirm('确定删除当前数据吗？', function (index) {
                            layer.close(index);
                            var userRoleId = obj.data.userRoleId;
                            $.ajax({
                                url: serverPath.systemPath + setter.sysLinkPath + "userRole/del",
                                type: "post",
                                dataType: 'json',
                                data: {userRoleId: userRoleId},
                                success: function (data) {
                                    if (commons._filterRecord(data)) {
                                        window.parent.layer.alert(data.msg);
                                        table.reload('managementOfSubs', {page: {curr: 1,},});
                                    } else {
                                        window.parent.layer.alert(data.msg);
                                    }
                                }
                            })
                        });
                }
            });

            table.render({
                elem: '#orgSelectorsAdds',
                method: 'get',
                url: serverPath.systemPath + setter.sysLinkPath + 'sysUser/userSelectorQueryList',
                page: true,
                toolbar: '#userHeaderbar',
                height: 'full-144',
                defaultToolbar: ['filter', 'print'],
                where: {
                    roleId: roleId
                },
                cols: [
                    [{type: 'checkbox', fixed: 'left'},
                        {field: 'userId', title: 'ID', sort: true, hide: true},
                        {field: 'fullName', title: '姓名', sort: true, width:'49%'},
                        {field: 'orgName', title: '所属组织', sort: true, width:'49%'}
                    ]
                ],
                done: function (data) {
                }
            });
            totalFilter.init('orgSelectorsAdds');
            table.on('toolbar(orgSelectorsAdds)', function (obj) {
                var checkStatus = table.checkStatus(obj.config.id);
                var data = checkStatus.data;
                switch (obj.event) {
                    case 'query':
                        var params = {};
                        $(".userHeadManagement .filter-value").each(function () {
                            params[this.name] = this.value;
                        });
                        table.reload("orgSelectorsAdds", {
                            where: params
                        });
                        form.val('userHeadManagement', params);
                        break;
                    case 'clears':
                        var params = {};
                        $(".userHeadManagement .filter-value").each(function () {
                            params[this.name] = "";
                        });
                        table.reload("orgSelectorsAdds", {
                            where: params
                        });
                }
            });

            $(document).on("click", ".layui-table-body table.layui-table tbody tr", function () {
                var index = $(this).attr('data-index');
                var tableBox = $(this).parents('.layui-table-box');
                //存在固定列
                if (tableBox.find(".layui-table-fixed.layui-table-fixed-l").length > 0) {
                    tableDiv = tableBox.find(".layui-table-fixed.layui-table-fixed-l");
                } else {
                    tableDiv = tableBox.find(".layui-table-body.layui-table-main");
                }
                var checkCell = tableDiv.find("tr[data-index=" + index + "]").find("td div.laytable-cell-checkbox div.layui-form-checkbox I");
                if (checkCell.length > 0) {
                    checkCell.click();
                }
            });

            $(document).on("click", "td div.laytable-cell-checkbox div.layui-form-checkbox", function (e) {
                e.stopPropagation();
            });
            table.on('checkbox(orgSelectorsAdds)', function (obj) {
                var data = obj.data;
                var sel = obj.checked; //复选框状态
                var allS = obj.type; //是否全选
                var msg = {
                    name: data.fullName,
                    userId: data.userId
                };
                var arr_re = JSON.stringify(userList).indexOf(JSON.stringify(msg)); //判断有没有
                var arrAll = table.cache.orgSelectorsAdds;
                //全选
                if (allS == 'all') {
                    if (sel) {
                        for (var i = 0; i < arrAll.length; i++) {
                            var msgs = {
                                name: arrAll[i].fullName,
                                userId: arrAll[i].userId
                            };
                            var arr_res = JSON.stringify(userList).indexOf(JSON.stringify(msgs));
                            if (arr_res == -1) {
                                userList.push(msgs)
                            }
                        }
                    } else {
                        for (var i = 0; i < userList.length; i++) {
                            for (var j = 0; j < arrAll.length; j++) {
                                if (userList[i].userId == arrAll[j].userId) {
                                    userList.splice(i, 1);
                                    i--;
                                    break;
                                }
                            }
                        }
                    }
                } else {
                    if (sel) {
                        if (arr_re == -1) {
                            userList.push(msg);
                        }
                    } else {
                        if (arr_re != -1) {
                            for (var i = 0; i < userList.length; i++) {
                                if (userList[i].userId == msg.userId) {
                                    index = i;
                                }
                            }
                            userList.splice(index, 1);
                        }
                    }
                }
                $(".orgContentDivs").html("");
                superConfigDatas = [];
                for (var i = 0; i < userList.length; i++) {
                    $(".orgContentDivs").append("<tr><td>" + "<span>" + userList[i].name + "</span>" + " <i selectIds=" + "'" +
                        userList[i].userId + "'" + "class='layui-icon' style='position:absolute;right:12px;cursor: pointer'>&#xe640;</i></td></tr>");
                    superConfigDatas.push(userList[i].userId);
                }
                $(document).on('click','.orgContentDivs .layui-icon',function () {
//                $(".orgContentDivs .layui-icon").click(function () {
                    $(this).parent().parent().remove();
                    var delData = $(this).attr('selectIds');
                    for (var i = 0; i < userList.length; i++) {
                        if (userList[i].userId == delData) {
                            userList.splice(i, 1);
                        }
                    }
                    table.reload("orgSelectorsAdds", {
                        parseData: function (res) {
                            var _data = res.data;
                            if (_data.length > 0 && userList.length > 0) {
                                for (var i = 0; i < _data.length; i++) {
                                    var _d = _data[i];
                                    for (var j = 0; j < userList.length; j++) {
                                        var _td = userList[j];
                                        if (_d.userId === _td.userId) {
                                            _d.LAY_CHECKED = true;
                                        }
                                    }
                                }
                            }
                        },
                        page: {curr: 1}
                    });
                })

            });
            //全部取消
            $(".bottom .cancelUserData").click(function () {
                $(".orgContentDivs").html("");
                userList = [];
                superConfigDatas = userList;
                table.reload('orgSelectorsAdds')
            });
            $(".bottom .cancelDatas").click(function () {
                layer.close(indexUsreSel);
            });
            //保存
            $(".bottom .saveData").click(function () {
                $.ajax({
                    url: serverPath.systemPath + setter.sysLinkPath + "userRole/add",
                    type: "post",
                    dataType: 'json',
                    data: {
                        userId: superConfigDatas.join(','),
                        roleId: roleId
                    },
                    success: function (data) {
                        if (commons._filterRecord(data)) {
                            table.reload('managementOfSubs');
                            $(".orgContentDivs").html("");
                            userList = [];
                            superConfigDatas = userList;
                            layer.close(indexUsreSel);
                        } else {
                            window.parent.layer.alert(data.msg);
                        }
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        layer.alert("暂无数据，请稍后操作！" + XMLHttpRequest.status);
                    },
                });
            });
            $(".cancelMan").click(function () {
                parent.layer.close(parent.layer.getFrameIndex(window.name));
            })

        })
    </script>
</body>
</html>